<%-- 
    Document   : firstpage
    Created on : Dec 10, 2011, 6:59:21 PM
    Author     : HoangLiem
--%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page import="model.Sanpham"%>
<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<script type="text/javascript" src="js/jquery.countdown.js"></script>
<!DOCTYPE html>
<link href="style/body.css" rel="stylesheet" type="text/css" />
<link href="style/first_page.css" rel="stylesheet" type="text/css"/>
<ul id="pagination2" class="pagination">
    <div id="productNavigate" style=" position:absolute; width: 10px; float:right; right:15px; top: 873px; z-index: 50;">
        <li onclick="slideshow2.pos(0)">o</li>
        <li onclick="slideshow2.pos(1)">o</li>
        <li onclick="slideshow2.pos(2)">o</li>
        <li onclick="slideshow2.pos(3)">o</li>
    </div>
</ul>
<div id="body_left">
    <div id="top_category" class="body_left">
        <h3>Top Category</h3>
        <ul>
            <li><a href="tungDanhMuc?maDanhMuc=ldm01dm005">Laptop Computers</a></li>
            <li><a href="tungDanhMuc?maDanhMuc=ldm01dm003">Destop Computers</a></li>
        </ul>
    </div>
    <div id="way_to_win" class="body_left">
        <h3>Way To Win</h3>
        <ul>
            <li><a href="danhSach?loaids=mp">Most Popular</a></li>
            <li><a href="danhSach?loaids=dsp">Dollars Products</a></li>
        </ul>
    </div>
    <div id="quick_link" class="body_left">
        <h3>Quick Link</h3>
        <ul>
            <c:forEach items="${dayDanhMuc}" var="dsDanhMuc" varStatus="dayDanhMuc" begin="0" end="${dayDanhMuc.size()}" step="1">
                <c:forEach items="${dsDanhMuc}" var="danhMuc" varStatus="dsDanhMuc" begin="0" end="${dsDanhMuc.size()}" step="1">
                    <li><a href="tungDanhMuc?maDanhMuc=${danhMuc.getMaDanhMuc()}">${danhMuc.getTenDanhMuc()}</a></li>
                </c:forEach>
            </c:forEach>
        </ul>
    </div>
    <div id="ads_choices" class="body_left">
        <h3>Ads Choise</h3>
        <ul>
            <li><a href="#">Diamond</a></li>
            <li><a href="#">Womens Diamond</a></li>
        </ul>
    </div>
    <div class="body_left_ads">
        <a href="#"><img src="images/acs_ads.png"/></a>
    </div>
    <div class="body_left_ads">
        <a href="#"><img src="images/acs_ads.png"/></a>
    </div>
</div>
<div id="body_main">
    <!--start 1-->
    <div id="body_main_1" class="body_main">
        <div id="body_main_1_letf">
            <div style="width:96%;" >

                <div id="slider" style="margin: 6px;" onmouseover="javascript:slideshow.pause()" onmouseout="javascript:slideshow.auto()">
                    <ul>
                        <li><a href="danhSach?loaids=all"><img src="images/photos/HomeMar2012MEGAS.jpg" width="100%" height="100%"/></a></li>
                        <li><a href="danhSach?loaids=s&tuKhoa=apple"><img src="images/photos/apple-122811.jpg" width="100%" height="100%"/></a></li>
                        <li><a href="tungDanhMuc?maDanhMuc=ldm03dm001"><img src="images/photos/marquee_digcam_011612.jpg" width="100%" height="100%"/></a></li>
                        <li><a href="danhSach?loaids=pcs"><img src="images/photos/marquee_closing122711a.jpg" width="100%" height="100%"/></a></li>
                    </ul>
                </div>

            </div>
            <ul id="pagination" class="pagination5">
                <li onclick="slideshow.pos(0)"></li>
                <li onclick="slideshow.pos(1)"></li>
                <li onclick="slideshow.pos(2)"></li>
                <li onclick="slideshow.pos(3)"></li>
            </ul>
            <div style="width:100%;height:200px;margin-top:50px;background-color:#DDD;">
                <a href="#">Buy today</a>
            </div>
        </div>
        <script type="text/javascript">
            var slideshow=new TINY.slider.slide('slideshow',{
                id:'slider',
                auto:7,
                resume:true,
                vertical:false,
                navid:'pagination',
                activeclass:'current',
                position:0
            });
        </script>
        <div id="body_main_1_right">
            <div style="width:100%;background-color:brown;clear:both;"><h1><font color="white">TOP BID</font></h1></div>
            <div id="top_bid" class="top_bid">
                <div class="top_bid_item">
                    <div style="width:100%;">
                        <a href="chiTietSanPham?id=${dsTopBid[0].maSanPham}">${dsTopBid[0].tenSanPham}</a>
                    </div>
                    <div>
                        <a href="chiTietSanPham?id=${dsTopBid[0].maSanPham}"><img width="120px" height="120px" src="images/productImages/${dshinhTopBid[0][0].tenHinhAnh}"/></a>
                    </div>
                    <div style="width:100%;">
                        <p style="color:#06F">Number of bid: <a style="color:red">${dssoLuongbid[0]}</a> </p>
                    </div>
                </div>
                <div class="top_bid_item">
                    <div>
                        <a href="chiTietSanPham?id=${dsTopBid[1].maSanPham}">${dsTopBid[1].tenSanPham}</a>
                    </div>
                    <div>
                        <a href="chiTietSanPham?id=${dsTopBid[1].maSanPham}"><img width="120px" height="120px" src="images/productImages/${dshinhTopBid[1][0].tenHinhAnh}"/></a>
                    </div>
                    <div style="width:100%;">
                        <p style="color:#06F">Number of bid: <a style="color:red">${dssoLuongbid[1]}</a> </p>
                    </div>
                </div>
            </div>
            <div id="horizontal"><hr /></div>
        </div>
    </div>
    <!--end 1-->
    <!--start 2-->
    <div class="body_main_title"><h1><font color="white">Closing Bid</font></h1></div>
    <div style="background-color:brown;width:750px;height:40px;position:absolute;top:920px;; right:0px; z-index:9;">
        <h1><font color="white">New Auctions</font></h1>
    </div>

    <div id="body_main_2" class="body_main">
        <div>
            <div id="container">
                <div id="sliderSP" onmouseover="javascript:slideshow2.pause()" onmouseout="javascript:slideshow2.auto()">
                    <ul>
                        <c:forEach var="i" begin="0" end="3" step="1">
                            <li>
                                <div id="closing_bid" class="items">
                                    <c:forEach var="j" begin="0" end="3" step="1">
                                        <script type="text/javascript">
                                            $(function () {
                                                var austDay = new Date();
                                                austDay = new Date(${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getYear()} + 1900, ${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getMonth()}, ${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getDate()}, ${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getHours()}, ${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getMinutes()}, ${dsClosingBid[(i*4)+j].thoiDiemKetThuc.getSeconds()});
                                                $('#defaultCountdown${(i*4)+j}').countdown({until: austDay, format: 'dHM', serverSync: function() { return new Date('${dateNow}');} });
                                            });
                                        </script>
                                        <div class="item">
                                            <div>
                                                <a href="chiTietSanPham?id=${dsClosingBid[(i*4)+j].maSanPham}"><img width="120px" height="120px" src="images/productImages/${DSHinhAnh[(i*4)+j][0].tenHinhAnh}"/></a>
                                            </div>
                                            <div>
                                                <a style="font-size: 13px;" >bid to beat :</a>
                                            </div>
                                            <div>
                                                <a style="font-size: 16px;"><b>${dsClosingBid[(i*4)+j].getMyHighestPrice()},000VNĐ</b></a>
                                            </div>
                                            <div>
                                                <a>Closing : </a><a id="defaultCountdown${(i*4)+j}"></a>
                                            </div>
                                            <div>
                                                <a href="chiTietSanPham?id=${dsClosingBid[(i*4)+j].maSanPham}">${dsClosingBid[(i*4)+j].tenSanPham}</a>
                                            </div>
                                        </div>
                                    </c:forEach>
                                </div>

                                <div id="today bid" class="items">
                                    <c:forEach var="k" begin="0" end="3" step="1">
                                        <script type="text/javascript">
                                            $(function () {
                                                var austDay = new Date();
                                                austDay = new Date(${dsNearPost[(i*4)+k].thoiDiemKetThuc.getYear()} + 1900, ${dsNearPost[(i*4)+k].thoiDiemKetThuc.getMonth()}, ${dsNearPost[(i*4)+k].thoiDiemKetThuc.getDate()}, ${dsNearPost[(i*4)+k].thoiDiemKetThuc.getHours()}, ${dsNearPost[(i*4)+k].thoiDiemKetThuc.getMinutes()}, ${dsNearPost[(i*4)+k].thoiDiemKetThuc.getSeconds()});
                                                $('#defaultCountd2${(i*4)+k}').countdown({until: austDay, format: 'dHM', serverSync: function() { return new Date('${dateNow}');} });
                                            });
                                        </script>
                                        <div class="item">
                                            <div>
                                                <a href="chiTietSanPham?id=${dsNearPost[(i*4)+k].maSanPham}"><img width="120px" height="120px" src="images/productImages/${dshinhNearPost[(i*4)+k][0].tenHinhAnh}"/></a>
                                            </div>
                                            <div>
                                                <a style="font-size: 13px;" >bid to beat :</a>
                                            </div>
                                            <div>
                                                <a style="font-size: 16px;"><b>${dsNearPost[(i*4)+k].getMyHighestPrice()},000VNĐ</b></a>
                                            </div>
                                            <div>
                                                <a>Closing : </a><a id="defaultCountd2${(i*4)+k}"></a>
                                            </div>
                                            <div>
                                                <a href="chiTietSanPham?id=${dsNearPost[(i*4)+k].maSanPham}">${dsNearPost[(i*4)+k].tenSanPham}</a>
                                            </div>
                                        </div>
                                    </c:forEach>
                                </div>
                            </li>
                        </c:forEach>
                    </ul>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            var slideshow2=new TINY.slider.slide('slideshow2',{
                id:'sliderSP',
                auto:9,
                resume:true,
                vertical:true,
                navid:'pagination2',
                activeclass:'current',
                position:0
            });
        </script>
    </div>
    <!--end 2-->
    <%-- <div class="horizontal"><hr/></div> --%>
    <!--start 3 -->
    <div id="body_main_3" class="body_main">
        <div id="ads_body_main_list">
            <c:choose>
                <c:when test="${user.dienThoai == 'a'}"> 
                    <div style="text-align: center; color:#F65D20; margin-bottom: 10px; margin-top: 10px;"><h2><b>Admin area</b></h2></div>
                </c:when>
            </c:choose>
            <div class="itemAds">
                <c:choose>
                    <c:when test="${user.dienThoai == 'a'}">
                        <div style="width:100%; height:50%;text-align: center; margin-left: 10px; margin-top: 10px;">
                            <div style="margin-top: 35px;"><a href="quanLyThanhVien"><img style="border:1px solid #EEE;border-color:#222;" width="150px" height="150px" src="images/manageImage/UserManager.jpg"/></a></div>
                            <div style="width: 200px; color:#00C; margin-top: 20px;"><h3><b><a href="quanLyThanhVien">Members Management</a></b></h3></div>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <div style="width:100%; height:50%;text-align: left; margin-left: 10px; margin-top: 10px;">
                            <div style="width: 200px;"><a>Our website with trust to do the first set, we'll try our best to help you get your favorite items at low prices.</a></div>
                            <div style="margin-top: 35px;"><img width="150px" height="150px" src="images/image3s.jpg"/></div>
                        </div>
                    </c:otherwise>
                </c:choose>
            </div>
            <div class="itemAds">
                <c:choose>
                    <c:when test="${user.dienThoai == 'a'}">
                        <div style="width:100%; height:50%;text-align: center; margin-left: 10px; margin-top: 10px;">
                            <div style="margin-top: 35px;"><a href="danhSach?loaids=all"><img style="border:1px solid #EEE;border-color:#222;" width="150px" height="150px" src="images/manageImage/productManage.jpg"/></a></div>
                            <div style="width: 200px; color:#00C; margin-top: 20px;"><h3><a href="danhSach?loaids=all"><b>Products Management</b></a></h3></div>
                            <div style="width: 200px; color:#00C; margin-top: 20px;"><h3><a href="themSanPham"><b>Insert New Products</b></a></h3></div>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <div style="width:100%; height:50%;text-align: left; margin-left: 10px; margin-top: 10px;">
                            <div style="float: left;"><img width="50px" height="50px" src="images/image5s.jpg"/></div>
                            <div style="width: 200px;"><a>A large mount, Over five and some people have registered an account with iBid.vn. What are you waiting for?</a></div>
                        </div>
                        <div style="width:100%; height:50%;text-align: left; margin-left: 10px; margin-top: -40px;">
                            <div style="float: left;"><img width="50px" height="50px" src="images/image2s.jpg"/></div>
                            <div style="width: 200px;"><a>Transportation service convenient and perfectly safe, do not worry about problems caused by shipping damage</a></div>
                        </div>
                        <div style="width:100%; height:50%;text-align: left; margin-left: 10px; margin-top: -40px;">
                            <div style="float: left;"><a target="_blank" href="https://www.nganluong.vn"><img width="50px" height="50px" src="images/nganluonglogo.jpg"/></a></div>
                            <div style="width: 220px;"><a>Pay safely and conveniently with <a target="_blank" style="text-decoration: none;" href="https://www.nganluong.vn">nganluong.vn</a></a></div>
                        </div>
                    </c:otherwise>
                </c:choose>
            </div>
            <div class="itemAds">
                <c:choose>
                    <c:when test="${user.dienThoai == 'a'}">
                        <div style="width:100%; height:50%;text-align: center; margin-left: 10px; margin-top: 10px;">
                            <div style="margin-top: 35px;"><a href="quanLyHoaDon"><img style="border:1px solid #EEE;border-color:#222;" width="150px" height="150px" src="images/manageImage/quanlyhoadon.jpg"/></a></div>
                            <div style="width: 200px; color:#00C; margin-top: 20px;"><h3><b><a href="quanLyHoaDon">Payments Management</a></b></h3></div>
                        </div>
                    </c:when>
                    <c:otherwise>
                        <div style="width:100%; height:50%; text-align: left; margin-left: 10px; margin-top: 10px;">
                            <p>Sign In to save on excess inventory from the world's most trusted brands.</p>
                            <br></br>
                            <c:choose>
                                <c:when test="${user == null}">
                                    <p style="margin-top: -20px;"><a target="_blank" href="#?w=500" rel="popup_name" class="poplight"><img src="images/buttonSignin.JPG"  border="0" /></a></p>
                                        </c:when>
                                        <c:otherwise>
                                    <p style="margin-top: -20px;"><a href="myPage"><img src="images/buttonSignin.JPG"  border="0" /></a></p>
                                        </c:otherwise>
                                    </c:choose>
                        </div>
                        <div class="horizontal"><hr/></div>
                        <div style="width:100%; height:50%; text-align: left; margin-left: 10px; margin-top: 10px;">
                            <p>Get connected to incredible inventory deals from the worlds most trusted brands.</p>
                            <p style="margin-top: 15px;"><a href="dangKy"><img src="images/buttonRegist.JPG"  border="0" /></a></p>
                        </div>
                    </c:otherwise>
                </c:choose>
            </div>
        </div>
    </div>
    <!--end 3 -->
    <div id="body_main_4" style="width:100%;clear:both;height:50px;background-color:#DDD;">
        <a href="#">Các link liên kết khác</a>
    </div>
</div>
